

<!----><template>
  <view class="my-config">

	  <view class="my">
	  	<view class="my-header" >
	  	<!--<image class="image-bg" src="../../static/背景6.jpg" mode=""></image><!--背景图-->
	  	<view class="header-main">

	  		<!--昵称-->

	  	<view class="header-logo" >

	  			<!-- <image class="logo-img" @click="uploadAvatar" src="loginStatus ? userInfo.imgurl:'../../static/my photo .png'" mode=""></image>-->
	  			<image class="logo-img" @click="uploadAvatar" :src="imgsrc/*getImage('gc-project/system/image/ShuTu.jpg')*/" mode=""></image>	<!--头像-->
	  			<view class="logo-name" @click="uploadAvatar">点击设置头像</view>
	  			<!--{{  loginStatus ? userInfo.nickName:"用户昵称"}}--><!--如果是登录状态了就显示用户昵称-->
	  	</view>
	  		<!--昵称-->

	  	</view>
	  	</view>
	</view>

    <view class="config-item" @click="goto('/pages/nickName/nickName')"  >
    	<view class="text"> 用户昵称：</view>
	    <input v-model="this.user.name" placeholder="待渲染"></input>
		<view class="show-pwd"> ></view>
		<view class="config-mark"></view>
    </view>

	<view class="config-item" @click="goto('/pages/introduction/introduction')">
		<view class="text"> 个人介绍：</view>
	    <input v-model="this.user.introduce" placeholder="待填写"></input>
		<view class="show-pwd"> ></view>
		<view class="config-mark"></view>
	</view>
	<view class="config-item" @click="goto('/pages/email/email')">
		<view class="text"> 邮箱：</view>
	    <input v-model="this.user.email" placeholder="待填写"></input>
		<view class="show-pwd"> ></view>
		<view class="config-mark"></view>
	</view>
	<view class="config-item" @click="goto('/pages/birth/birth')">
		<view class="text"> 生日：</view>
	    <input v-model="this.user.birth" placeholder="待填写"></input>
		<view class="show-pwd"> ></view>
		<view class="config-mark"></view>
	</view>

	<view class="config-item" @click="goto('/pages/sex/sex')">
		<view class="text"> 选择性别：</view>
	<text v-if="this.user.sex==true" >女</text> 
	<text v-if="this.user.sex==false" >男</text> 
	    <input  >	  </input>
			<view class="show-pwd"> ></view>
		<view class="config-mark"></view>
	</view>

	<view class="config-item" @tap='goPathList'>
		<view class="text">地址管理</view>
		<view class="show-pwd1">>>></view>
		<view class="config-mark"></view>
	</view>


	<!--<view class="my-exit" @tap='outLogin'>退出登录</view>-->

  </view>
</template>

<script>
 import {mapMutations} from 'vuex';
  export default {
	  props:{
		  customer:Object
	  },
	  data(){
		  return{
			  avatarUrl :'',
			   nickName: '',
			        showFavorites: false,
			        showUpdates: false,
			        receiveNotifications: false,
			
			        introduction: '',
					user:[],
					users:[],
					 filepath:[],
					 imgsrc:'',
		  }
	  },
	  mounted() {
			
	  	//全局变量用户ID
	  //	this.userId = uni.getStorageSync('userId');
	  		this.user = uni.getStorageSync('user');
	  		//this.userName = uni.getStorageSync('user.name');
	  		console.log('555',this.user)
	  	//this.address();
	  },
	 
    methods: {
		...mapMutations(['loginOut']),
	
      goPathList() {
        uni.navigateTo({
         url:'../my-path-list/my-path-list'
        })
      },

	  // 从对象存储中获取图片
	  	getImage(image) {
	  				return `http://43.136.172.73/api/v1/user/upgrade_avatar=${image}`
					
					
	  		},
	  goto(url) {
	    uni.navigateTo({
	      url: url
	    })
	  },
	  uploadAvatar() {
	
	  uni.chooseImage({
	    count: 1, // 最多选择一张图片
	    success: (res) => {
	      const tempFilePaths = res.tempFilePaths;
	      this.uploadImage(tempFilePaths[0]);
		  console.log('77',tempFilePaths[0])
	    }
	  });
	},
uploadImage(filePath) {
  const boundary = '----WebKitFormBoundary' + new Date().getTime();
  uni.uploadFile({
    url: 'http://43.136.172.73/api/v1/account/upload/files',
    method: 'POST',
    filePath: filePath,
    name: 'data',
    header: {
      'Content-Type': 'multipart/form-data; boundary=' + boundary,
      'Authorization': 'sfsdf'
    },
    formData: {
      // 将修改后的请求体内容添加到formData字段中
      data: `------WebKitFormBoundary${boundary}\r\nContent-Disposition: form-data; name="data"; filename="image-20230522112043915.png"\r\nContent-Type: image/png\r\n\r\n\r\n------WebKitFormBoundary${boundary}--`
    },
    success: (res) => {
      if (res.statusCode === 200) {
        const data = JSON.parse(res.data);
        // 处理上传成功后的逻辑
        // 例如，更新用户头像信息、展示上传成功提示等
        uni.showToast({
          title: '上传成功',
          icon: 'none',
        });
        console.log('上传成功:', res);
        this.avatarUrl = data.url;
        console.log('用户头像URL:', this.avatarUrl);
      } else {
        // 处理上传失败的逻辑
        uni.showToast({
          title: '上传失败',
          icon: 'none'
        });
      }
    },
    fail: () => {
      // 处理上传失败的逻辑
      uni.showToast({
        title: '上传失败',
        icon: 'none'
      });
    }
  });
}
,
		// uploadAvatar() {
		// 	      // 头像上传逻辑
		// 		   uni.chooseImage({
		// 		        count: 1, // 最多选择一张图片
		// 		        success: (res) => {
		// 		          const tempFilePaths = res.tempFilePaths
		// 		          this.uploadImage(JSON.parse(tempFilePaths[0]))
		// 		        }
		// 		      })

  //     // 头像上传逻辑
	 //   // uni.chooseImage({
	 //   //      count: 1, // 最多选择一张图片
	 //   //      success: (res) => {
	 //   //        const tempFilePaths = res.tempFilePaths
	 //   //        this.uploadImage(tempFilePaths[0])
	 //   //      }
	 //   //    })
		// },
		// uploadImage(filePath) {
		// 	console.log('222',filePath)
			
			
		// uni.uploadFile({
		// 	url: 'http://43.136.172.73/api/v1//user/upgrade_avatar',
		// 	method: 'PUT',
		// 	  data: {
		// 	      files: filePath // 将 filePath 设置为请求参数的值
		// 	    }, // 直接使用requestData作为请求参数
		// 	header: {
		// 							// "Content-Type": "application/x-www-form-urlencoded",
		// 							'Authorization': 'sfsdf',
		// 	},
		// 	success: (res) => {
		// 		    // 请求成功的回调函数
		// 			// var obj = JSON.parse(uploadFileRes.data);
		// 			 //console.log(obj)
		// 			uni.showToast({
		// 				title:'上传成功',
		// 				icon:'none',
		// 			})
		// 			console.log('00000' ,res);
		// 			this.avatarUrl = res.data.data;

		// 			//console.log('打印用户' );
		// 		  },
		// 		  fail: (err) => {
		// 		    // 请求失败的回调函数
		// 		    console.log(err);
		// 		  }
		// 		});
		// 		},
		 // uni.uploadFile({
		 //   url: 'http://43.136.172.73/api/v1/account/upload/files', // 图片上传接口地址
			// method: 'POST',
			// data: filePath,
		 //    // 要上传的图片文件路径
		 //  name: 'data', // 上传图片文件对应的字段名
		 //   header: {
		 //     'Content-Type': 'multipart/form-data', // 设置Content-Type为multipart/form-data
		 //     'Authorization': 'sfsdf' // 根据实际情况设置请求头Authorization
		 //   },
		 //   success: (res) => {
		 //     if (res.statusCode === 200) {
		 //       const data = JSON.parse(res.data)
		 //       // 处理上传成功后的逻辑
		 //       // 例如，更新用户头像信息、展示上传成功提示等
		 // 	  uni.showToast({
		 // 	    title:'上传成功',
		 // 	    icon:'none',
		 //       })
		 //       console.log('00000' ,res);
		 //       this.avatarUrl = data.url;
		 //       console.log('打印用户', this.avatarUrl);
		 //     } else {
		 //       // 处理上传失败的逻辑
		 //       uni.showToast({
		 //         title: '上传失败',
		 //         icon: 'none'
		 //       })
		 //     }
		 //   },
		 //   fail: () => {
		 //     // 处理上传失败的逻辑
		 //     uni.showToast({
		 //       title: '上传失败',
		 //       icon: 'none'
		 //     })
		 //   }
		 // })

		

	  save() {
	      // 保存用户信息逻辑
	    },
	  outLogin(){
		  uni.showToast({
			  title:"退出成功",
			  icon:"none"
		  })
		  this.loginOut();//调用user.js的函数loginout
		  uni.reLaunch({
			  url:"../index/index"
		  })




	  }
    }
  }
</script>

<style scoped>
		//顶部栏
			.my{
			background-color: aliceblue;
			margin-bottom: 50rpx;
			}

			.my-header{

				position: relative;
				z-index: 0; // 支付宝小程序下背景不生效时，可以加上这个
			    height:320rpx ;
			}

			.header-main{
				display: flex;
				justify-content: space-between;
				align-items: center;
				flex-direction: column;
				position: relative;
				top: 90rpx;


			}
			.header-config{
				position: absolute;


			}
			.header-logo{

				display: flex;
				position: absolute;

				width: 60%;
				display: flex;

				flex-direction: column;
				justify-content: center;
				align-items: center;
			}

			.logo-img{
				width: 120rpx;
				height: 120rpx;
				border-radius: 50%;
				border: 2rpx solid #CCCCCC;
				background-color: #FFFFFF;
			}

			.logo-name{
				width: 300rpx;

				color: black;
				font-size: 30rpx;
				display: flex;
				justify-content: center;
				align-items: center;

			}


			.show-pwd {
			  position: absolute;
			  right: 50rpx;
			  color: darkgray;
			  padding-top: 10rpx;
			  padding-bottom: 10rpx;
			  cursor: pointer;

			}
			.show-pwd1 {
			  position: absolute;
			  right: 420rpx;
			  color: darkgray;
			  padding-top: 10rpx;
			  padding-bottom: 10rpx;
			  cursor: pointer;

			}



			//权益模块
			.myself{

			margin: 30rpx;
			margin-top: 60rpx;
			/*box-shadow:0 0 1px 1px rgba(0, 0, 0, 0.2);*/
			}
			.myself-title{
			display: flex;
			justify-content: space-between;
			align-items: center;
			padding: 20rpx;
			background-color: aliceblue;;
			font-weight: bold;;
			}

			.myself-list{
				padding: 20rpx;
				display: flex;
				flex-wrap: wrap;

				background-color: azure;
			}
			.myself-item{
				width: 33%;
				padding: 10rpx;
				display: flex;
				flex-direction: column;
				justify-content: center;
				align-items: center;

			}
			.myself-img{
				width:56rpx ;
				height: 56rpx;
			}



	.my-config{
		padding: 30rpx;
	}
 .config-item{
	 padding: 100rpx; display: flex;
	 justify-content: space-between;
	 padding: 20rpx 0 20rpx 20rpx;
	 border-bottom: 2rpx solid #CCCCCC;
	margin: 25rpx;
 }
 .text{
	 font-size: 32rpx;
 }
 .config-mark{
	 padding-right: 10rpx;

 }
 .my-exit{

	margin-top: 100rpx;
	height: 100rpx;
	line-height: 100rpx;
	text-align: center;
	color:#FFFF ;
	background-color: #49BDFB;
	border-radius: 40rpx;

 }
</style>
